<template>

  <el-form :model="ruleForm" :rules="rules" :inline="true" ref="ruleForm" label-width="250px" class="demo-ruleForm">
    <el-form-item label="学校标识码" prop="schoolcode">
      <el-input v-model="ruleForm.schoolcode"></el-input>
    </el-form-item>
    <el-form-item label="学校名称" prop="schoolname">
      <el-input v-model="ruleForm.schoolname"></el-input>
    </el-form-item>
    <el-form-item label="学校地址名称" prop="schoollocationname">
      <el-input v-model="ruleForm.schoollocationname"></el-input>
    </el-form-item>
    <el-form-item label="学校地址代码" prop="schoollocationcode">
      <el-input v-model="ruleForm.schoollocationcode"></el-input>
    </el-form-item>
    <el-form-item label="学校驻地城乡类型代码">
      <el-select v-model="locationtypevalue" placeholder="请选择要搜索的字段" @change="getLocationTypeName">
        <el-option
            v-for="item in locationtypeoptions"
            :key="item.value"
            :label="item.label"
            :value="item.value">
        </el-option>
      </el-select>
    </el-form-item>
    <el-form-item label="学校驻地城乡类型名称" prop="schoollocationtypename">
      <el-input v-model="ruleForm.schoollocationtypename" readonly></el-input>
    </el-form-item>
    <el-form-item label="学校办学类型代码">
      <el-select v-model="typevalue" placeholder="请选择要搜索的字段" @change="getTypeName">
        <el-option
            v-for="item in typeoptions"
            :key="item.value"
            :label="item.label"
            :value="item.value">
        </el-option>
      </el-select>
    </el-form-item>
    <el-form-item label="学校办学类型名称" prop="schooltypename">
      <el-input v-model="ruleForm.schooltypename" readonly></el-input>
    </el-form-item>
    <el-form-item label="学校举办者代码">
      <el-select v-model="hostvalue" placeholder="请选择要搜索的字段" @change="getHostName">
        <el-option
            v-for="item in hostoptions"
            :key="item.value"
            :label="item.label"
            :value="item.value">
        </el-option>
      </el-select>
    </el-form-item>
    <el-form-item label="学校举办者名称" prop="schoolhostname">
      <el-input v-model="ruleForm.schoolhostname" readonly></el-input>
    </el-form-item>

    <el-form-item>
      <el-button type="primary" @click="submitForm('ruleForm')">确认修改</el-button>
      <el-button @click="resetForm('ruleForm')">重置</el-button>
    </el-form-item>
  </el-form>
</template>
<script>
export default {
  data() {
    return {
      ruleForm: {
        schoolcode: '',
        schoolname: '',
        schoollocationname: '',
        schoollocationcode: '',
        schoollocationtypecode: '',
        schoollocationtypename: '',
        schooltypecode: '',
        schooltypename: '',
        schoolhostcode: '',
        schoolhostname:''
      },
      rules: {
        id: [
          { required: true, message: '请填写编号 注意与已存在的编号不要重复', trigger: 'blur' }
        ],
        schoolcode: [
          { required: true, message: '请填写学校标识码，没有则填无', trigger: 'blur' }
        ],
        schoolname: [
          { required: true, message: '学校名称不可更改,若学校名称更改，请重新添加', trigger:'blur' }
        ],
        schoollocationname: [
          { required: true, message: '请填写学校地址名称，没有则填无', trigger: 'change' }
        ],
        schoollocationcode: [
          { required: true, message: '请填写学校地址代码，没有则填无', trigger: 'change' }
        ],
        schoollocationtypecode: [
          { required: true, message: '请填写学校驻地城乡类型，没有则填无', trigger: 'change' }
        ],
        schoollocationtypename: [
          { required: true, message: '请在左侧选择学校驻地城乡类型', trigger: 'change' }
        ],
        schooltypecode: [
          { required: true, message: '请填写学校办学类型，没有则填无', trigger: 'change' }
        ],
        schooltypename: [
          { required: true, message: '请在左侧选择学校办学类型代码', trigger: 'change' }
        ],
        schoolhostcode: [
          { required: true, message: '请填写学校举办者代码，没有则填无', trigger: 'change' }
        ],
        schoolhostname: [
          { required: true, message: '请在左侧选择学校举办者代码', trigger: 'change' }
        ],
      },
      typevalue: '',
      typeoptions: [],
      typenameoptions: [],
      hostvalue:'',
      hostoptions:[],
      hostnameoptions:[],
      locationtypevalue:'',
      locationtypeoptions:[],
      locationtypenameoptions:[],
      tlen:'',
      llen:'',
      hlen:''
    };
  },
  methods: {
    getTypeName(){
      this.ruleForm.schooltypename=this.typenameoptions[Math.abs(this.tlen-this.typevalue-1)].label
      this.ruleForm.schooltypecode=this.typeoptions[Math.abs(this.tlen-this.typevalue-1)].label

    },
    getLocationTypeName(){
      this.ruleForm.schoollocationtypename=this.locationtypenameoptions[Math.abs(this.llen-this.locationtypevalue-1)].label
      this.ruleForm.schoollocationtypecode=this.locationtypeoptions[Math.abs(this.llen-this.locationtypevalue-1)].label
    },
    getHostName(){
      this.ruleForm.schoolhostname=this.hostnameoptions[Math.abs(this.hlen-this.hostvalue-1)].label
      this.ruleForm.schoolhostcode=this.hostoptions[Math.abs(this.hlen-this.hostvalue-1)].label
    },
    submitForm(formName) {
      const _this=this
      this.$refs[formName].validate((valid) => {
        if (valid) {
          axios.put("http://localhost:8081/school/update",this.ruleForm).then(function (res){
            if (res.data.msg==="更新成功"){
              _this.$message({
              message: '修改成功！',
              type: 'success'
            });
              //添加成功后页面跳转
              _this.$router.push('/SchoolList')
            }
          else{
              _this.$message({
                message: '学校名称重复！请重新输入',
                type: 'fail'
              });
            }
          })
        } else {
          console.log('error submit!!');
          return false;
        }
      });
    },
    resetForm(formName) {
      // this.$refs[formName].resetFields();
      const _this=this
      axios.get("http://localhost:8081/school/selectone/"+this.$route.query.id).then(function (res){
        _this.ruleForm=res.data
      })
    }
  },
  mounted() {
      const _this=this
      let typelen=0
      let locationtypelen=0
      let hostlen=0
      const a=localStorage.getItem("access-admin")
      if(a){
        axios.get("http://localhost:8081/schooltype/findAll").then(function (res){
          typelen=res.data.length;
          _this.tlen=res.data.length
          while(typelen){
            typelen--;
            _this.typeoptions.push({value:typelen,label:res.data[typelen].schooltypecode})
            _this.typenameoptions.push({value:typelen,label:res.data[typelen].schooltypename})
          }
        })
        axios.get("http://localhost:8081/schoollocationtype/findAll").then(function (res){
          locationtypelen=res.data.length;
          _this.llen=res.data.length;
          while(locationtypelen){
            locationtypelen--;
            _this.locationtypeoptions.push({value:locationtypelen,label:res.data[locationtypelen].schoollocationtypecode})
            _this.locationtypenameoptions.push({value:locationtypelen,label:res.data[locationtypelen].schoollocationtypename})
          }
        })
        axios.get("http://localhost:8081/schoolhost/findAll").then(function (res){
          hostlen=res.data.length;
          _this.hlen=res.data.length;
          while(hostlen){
            hostlen--;
            _this.hostoptions.push({value:hostlen,label:res.data[hostlen].schoolhostcode})
            _this.hostnameoptions.push({value:hostlen,label:res.data[hostlen].schoolhostname})
          }
        })
        axios.get("http://localhost:8081/school/selectone/"+this.$route.query.id).then(function (res){
          _this.ruleForm=res.data
          let lent=_this.tlen;
          let lenl=_this.llen;
          let lenh=_this.hlen;
          let v=0;
          // while(lent!==0||lenl!==0||lenh!==0){
          //   lent--;
          //   lenl--;
          //   lenh--;
          //   if (lent<0){
          //     lent=0
          //   }
          //   if (lenl<0){
          //     lenl=0
          //   }
          //   if (lenh<0){
          //     lenh=0
          //   }
          //   if (_this.typenameoptions[lent].label===res.data.schooltypename){
          //     v=lent;
          //     _this.typevalue=_this.typeoptions[v].label
          //     console.log("typevalue的默认值",_this.typevalue)
          //   }
          //   if (_this.locationtypenameoptions[lenl].label===res.data.schoollocationtypename){
          //     v=lenl;
          //     _this.locationtypevalue=_this.locationtypeoptions[v].label
          //     console.log("locationtypevalue的默认值",_this.locationtypevalue)
          //   }
          //   if (_this.hostnameoptions[lenh].label===res.data.schoolhostname){
          //     v=lenh;
          //     _this.hostvalue=_this.hostoptions[v].label
          //     console.log("hostvalue的默认值",_this.hostvalue)
          //   }
          // }
        })
      }
      else{
        this.$alert('未登录','提示',{
          confirmButtonText:'确定'
        }).then((res)=>{
          this.$router.replace({path:'/login'})
        })
      }
  }
}
</script>
<style scoped>
.el-input,.el-select{
  width: 330px;
}

/*.el-select{*/
/*  width: 300px;*/
/*}*/
</style>
